<template>
  <div class="container">
    <div class="header">
      <van-nav-bar title="个人中心">
        <template #right>
          <!-- <van-icon name="setting-o"></van-icon> -->
        </template>
      </van-nav-bar>
    </div>
    <div class="banner" v-for="(item, index) in userList" :key="index">
      <!-- <img src="../assets/131.jpg" /> -->

      <span>
        <img :src="item.pic" />
      </span>
      <span>{{ item.name }}</span>
    </div>
    <van-cell
      title="我的订单"
      style="margin-top: 10px"
      @click="onOrder"
      is-link
      value="全部订单"
    ></van-cell>

    <van-cell
      title="我的优惠券"
      style="margin-top: 10px"
      @click="onClik"
    ></van-cell>

    <van-cell
      title="我的收藏"
      @click="onCoe"
      style="margin-top: 10px"
      is-link
    ></van-cell>
    <van-cell
      title="收货地址"
      @click="Pages('/addresslist')"
      is-link
    ></van-cell>
    <van-cell title="服务中心" is-link @click="Onsetup"></van-cell>
  </div>
</template>
<script>
import { Toast } from "vant";
import axios from "axios";
export default {
  name: "FlowerUser",

  data() {
    return {
      userList: [],
    };
  },

  mounted() {
    this.getData();
  },

  methods: {
    getData() {
      axios({
        url: "http://127.0.0.1:3000/users/info",
        method: "get",
      }).then((res) => {
        this.userList = res.data;
        console.log(this.userList);
      });
    },
    Pages(path) {
      if (this.$route.path === path) {
        return;
      }
      this.$router.push({
        path: path,
      });
    },
    onClik() {
      Toast("暂无优惠券");
    },
    onCoe() {
      this.$router.push({
        path: "/coe",
      });
    },
    onOrder() {
      this.$router.push({
        path: "/order",
      });
    },
    Onsetup() {
      this.$router.push({
        path: "/setup",
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.container {
  background: #f2f2f2;

  .banner {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 150px;
    background: url("../assets/aaa.jpg");
  }
  .banner img {
    width: 100px;
    height: 100px;
    margin-top: 15px;
    border-radius: 50%;
  }

  .van-icon {
    font-size: 25px;
  }
}
</style>